/* eslint-disable react/jsx-indent */
import React, { PureComponent } from 'react';
import { Card } from 'antd';
import moment from 'moment';
import DescriptionList from '@/components/DescriptionList';

const { Description } = DescriptionList;

class ContactInfor extends PureComponent {
  state = {};

  render() {
    const { entryContRcrds } = this.props;
    return (
      <Card
        title={
          <span style={{ fontWeight: 'bolder' }} id="contactRecord">
            联系记录
          </span>
        }
        bordered={false}
      >
        {entryContRcrds && entryContRcrds.length
          ? entryContRcrds.map(item => (
              <DescriptionList
                style={{  paddingLeft: '5%' }}
                key={item.contactTime}
              >
                <Description span={8} term="联系方式">
                  {item.contactWayName ? item.contactWayName : '--'}
                </Description>
                <Description span={8} term={item.contactWay === 3 ? '邮箱' : '联系电话'}>
                  {item.contactNo ? item.contactNo : '--'}
                </Description>
                <Description span={8} term="联系人">
                  {item.creName ? item.creName : '--'}
                </Description>
                <Description span={8} term="联系时间">
                  {item.contactTime ? moment(item.contactTime).format('YYYY-MM-DD HH:mm') : '--'}
                </Description>
                <Description span={8} term="联系内容">
                  {item.content ? (
                    <span dangerouslySetInnerHTML={{ __html: item.content }} />
                  ) : null}
                  {item.remark ? <span dangerouslySetInnerHTML={{ __html: item.remark }} /> : null}
                  {!item.content && !item.remark && '--'}
                </Description>
              </DescriptionList>
            ))
          : '暂无数据'}
      </Card>
    );
  }
}

export default ContactInfor;
